<template>
  <div class='detail bc-gray'>
    <div class="bc-white">
      <p class="item1">
        <span>{{detailData.category_name}}</span>
        <span class="fr">{{detailData.date}}</span>
      </p>
      <p class="item3">{{detailData.content}}</p>
      <hr>
      <p><span class="ft16">回复</span></p>
      <van-field
        placeholder="请输入您的回复"
        type='textarea'
        v-model="detailData.reply_content"
        :readonly="detailData.reply_date==''"
      />
    </div>
    <div class="btn-b">
      <van-button type="primary" v-if="!detailData.reply_date" class="bc-green btn" @click="save">确认</van-button>
      <van-button type="danger" class="btn" @click="delDetail">删除</van-button>
    </div>
  </div>
</template>
<script>
import MixDetail from "../../../../../mixin/mixin.js";
export default {
  components: {},
  name: "",
  data() {
    return {
      
    };
  },
  methods: {
    save(){
      var params={
        id:_g.getRouterParams(this).id,
        content:this.detailData.reply_content
      }
      _g.apiPost(this.resquest.editDetail,params).then(res=>{
        _g.toMessage(res)
        if (!res.error) this.$router.go(-1)
      })
    }
  },
  created() {},
  mixins: [MixDetail]
};
</script>
<style lang="scss" scoped>
.detail {
  .bc-white {
    padding: 20px 30px;
    box-sizing: border-box;
  }

  .item1 {
    color: #666;
    font-size: 13px;
    span:nth-of-type(1) {
      font-size: 16px;
      color: #4a90e2;
      height: 50px;
      line-height: 50px;
    }
  }
  .item2 {
    font-size: 13px;
    margin-top: 5px;
  }
  .item3 {
    font-size: 13px;
    margin-top: 10px;
    overflow-wrap: break-word;
    text-indent: 15px;
    line-height: 45px;
  }
  hr {
    border: none;
    border-top: 1px solid #efeff4;
  }
  .ft16{
    font-size: 16px;
  }
  .btn-b{
    width: 90%;
    margin: 0 5%;

    .btn{
      width: 100%;
      margin-top: 50px;
    }
  }
}
</style>